<template>
  <div class="page_nav">
    <div class="floorBox" @click="goLouCeng('1F')">
      <div class="left">1F</div>
      <div class="right">
        <span>口腔综合急诊·粘膜病科</span>
        <span>药剂科</span> <span>检验科</span> <span>住院处</span>
        <span>挂号收费处</span><span>安全保卫部</span><span>警务室</span>
        <span>监控室</span><span>总值班室</span> <span>收发室</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('2F')">
      <div class="left">2F</div>
      <div class="right">
        <span>牙周病科</span><span>牙体牙髓科病科</span><span>挂号收费处</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('3F')">
      <div class="left">3F</div>
      <div class="right">
        <span>口腔修复一科</span><span>口腔修复二科</span
        ><span>口腔正畸一科</span><span>挂号收费处</span>
        <span></span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('4F')">
      <div class="left">4F</div>
      <div class="right">
        <span>干诊科</span><span>儿童口腔科</span><span>采血室</span
        ><span>心电图室</span><span>口腔颌面外科</span><span>整形美容中心</span
        ><span>口腔颌面头颈肿瘤治疗中心</span><span>挂号收费处</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('5F')">
      <div class="left">5F</div>
      <div class="right">
        <span>口腔正畸二科</span><span>口腔颌面外科病房</span
        ><span>第二会议室</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('6F')">
      <div class="left">6F</div>
      <div class="right">
        <span>口腔颌面头颈外科病房</span><span>门诊手术室</span
        ><span>美容手术室</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('7F')">
      <div class="left">7F</div>
      <div class="right">
        <span>综合科（口腔临床培训中心）</span><span>牙合学门诊-肌电图室</span
        ><span>医务部</span><span>医患关系办公室</span
        ><span>医疗保险工作部</span><span> 消毒供应中心</span
        ><span> 院内感染管理办公室（预防保健办公室）</span
        ><span>后勤保障部</span><span>医疗设备部</span><span>信息中心</span
        ><span>挂号收费处</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('8F')">
      <div class="left">8F</div>
      <div class="right">
        <span>口腔预防门诊</span><span>手术室</span><span>麻醉科</span
        ><span>血库</span><span>病案室</span><span>舒适化治疗中心</span
        ><span>麻醉复苏室</span>
      </div>
    </div>
    <div class="floorBox" @click="goLouCeng('9F')">
      <div class="left">9F</div>
      <div class="right">
        <span>口腔种植中心</span><span>学术报告厅</span><span>第一会议室</span
        ><span>挂号收费处</span>
      </div>
    </div>
  </div>
</template>
<script>
import { hospitalConfig } from "@/api/api";
export default {
  data() {
    return {
      resdata: {},
    };
  },
  created() {
    this.hospitalConfig();
  },
  methods: {
    hospitalConfig() {
      hospitalConfig().then((res) => {
        if (res.code == 200) {
          this.resdata = res.data;
        }
      });
    },
    goLouCeng(FF) {
      this.$router.push({
        path: "/hosp_navigation_detail1",
        query:{
          FF
        }
      });
    },
  },
};
</script>
<style scoped>
.page_nav {
  min-height: calc(100vh - 0.75rem);
  height: 100%;
  background-color: #f7fafd;
}
.floorBox {
  width: calc(100% - 4rem);
  margin: 0.75rem 1rem;
  padding: 1rem;
  background: #ffffff;
  box-shadow: 0px 0px 15px 0px rgba(174, 206, 254, 0.3);
  border-radius: 6px;
  display: flex;
  align-items: center;
}
.floorBox .left {
  width: 3.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 23px;
  font-family: PingFang SC;
  font-weight: bold;
  color: #448eff;
  margin-right: 1.25rem;
}
.floorBox .right {
  font-size: 0.875rem;
  color: #3f4551;
  font-weight: 500;
  width: calc(100% - 4.375rem);
}
.floorBox .right span {
  margin-right: 0.625rem;
  
}
</style>